<template>
  <div class="learn">
    <!-- 顶部功能 -->
    <van-nav-bar title="已购课程"></van-nav-bar>
    <!-- 课程列表 -->
    <course-content-list
    :fetch-data="fetchData"></course-content-list>
    <!-- 底部导航-->
    <layout-footer></layout-footer>
  </div>
</template>

<script>
import { NavBar } from 'vant'
import { getPurchaseCourse } from '@/services/course'
import courseContentList from '@/components/courseContentList'
import layoutFooter from '@/components/layoutFooter'
export default {
  name: 'Learn',
  components: {
    layoutFooter,
    courseContentList,
    VanNavBar: NavBar
  },
  // created () {
  //   this.loadPurchaseCourse()
  // },
  methods: {
    // async loadPurchaseCourse () {
    //   const { data } = await getPurchaseCourse()
    //   console.log(data)
    fetchData () {
      return getPurchaseCourse()
    }
  }
}
</script>

<style lang="scss" scoped>
.course-content-list {
  top: 50px;
  bottom: 50px;
}
</style>
